/**************************
 * Source Experiences Panel
 */
AIR2.Source.Experiences = function() {
    return new AIR2.UI.Panel({
        colspan: 1,
        title: 'Experiences',
        iconCls: 'air2-source-experiences-icon',
        storeData: AIR2.Source.SVDATA,
        url: AIR2.Source.BASEURL + '/src_vita',
        itemSelector: '.air2-source-experiences',
        tpl: new Ext.XTemplate(
                '<div class="air2-source-experiences">' +
                '<table>' +
                  '<tpl for=".">' +
                    '<tpl if="sv_type == \'E\'">' +
                      '<tr>' +
                        '<td><span class="experience-value">{[this.fvalue(values.sv_value)]}</span></td>' +
                        '<td>{[this.fvalue(values.sv_basis)]}</td>' +
                      '</tr>' +
                    '</tpl>' +
                  '</tpl>' +
                '</table>' +
                '</div>',
                {
                    compiled: true, 
                    disableFormats: true,
                    fvalue: function(fvalue) {
                        var ret;
                        ( fvalue ) ? ret = fvalue : "";
                        return ret;
                    }
                }
        ),
        editModal: {
            allowAdd: AIR2.Source.SUMMDATA.authz.may_write,
            items: {
                xtype: 'air2liveeditor',
                url: AIR2.Source.BASEURL + '/src_vita',
                pageSize: 50,
                allowEdit: AIR2.Source.SUMMDATA.authz.may_write,
                allowDelete: AIR2.Source.SUMMDATA.authz.may_write,
                hideButtons: true,
                editForm: {
                    labelAlign: 'top',
                    items: [{
                        xtype: 'hidden',
                        name: 'sv_type',
                        value: 'E'
                    },{
                        xtype: 'textfield',
                        width: '95%',
                        fieldLabel: 'What',
                        name: 'sv_value'
                    },{
                        xtype: 'textfield',
                        width: '95%',
                        fieldLabel: 'Where',
                        name: 'sv_basis'
                    },{
                        xtype: 'label',
                        text: 'When: Enter the start and end dates for the experience.'
                    },{
                        xtype: 'container',
                        layout: 'column',
                        items: [{
                            xtype: 'container',
                            columnWidth: .20,
                            layout: 'form',
                            items: {
                                xtype: 'datefield',
                                fieldLabel: 'Start',
                                width: '95%',
                                name: 'sv_start_date'
                            }
                        },{
                            xtype: 'container',
                            columnWidth: .20,
                            layout: 'form',
                            items: {
                                xtype: 'datefield',
                                fieldLabel: 'End',
                                name: 'sv_end_date'
                            }
                        }]
                    }]
                },
                tpl: new Ext.XTemplate(
                    '<div class="air2-source-experiences">' +
                      '<tpl if="sv_type == \'E\'">' +
                        '<div>What: {sv_value}</div>' +
                        '<div>Where: {sv_basis}</div> ' +
                        '<div>When: {[this.showDurationYears(values)]}</div>' +
                        '<button class="air2-rowedit"></button> ' +
                        '<button class="air2-rowdelete"></button>' +
                      '</tpl>' +  
                    '</div>',
                    { 
                        compiled: true,
                        disableFormats: true,
                        showDurationYears: function(values) {
                            var ret = ' No dates entered ';    
                            
                            if ( values.sv_start_date ) {
                                var sdt = values.sv_start_date;
                                (sdt) ? ret = sdt.format('Y') : 1;
                            }
                                
                            if ( values.sv_end_date ) {
                                var edt = values.sv_end_date;
                                (edt) ? ret += ' - '+edt.format('Y') : 1;
                            }
                            
                            return ret;
                        }
                    }
                )                
            }
        }
    });
}
